<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			html{
				margin: 0px;
				padding: 0px;
				width: 100%;
				height: 100%;
			}
			body{
				width: 100%;
				height: 100%;
				background-size: 100%;
			}
		</style>
	</head>
	<body>
		<script src="../js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript">
			$(function(){
				$(document).click(function(event){
					//随机获取显示的数组下标
					var i = Math.round(Math.random()*9);
					//文字数组
					var arry=["富强","民主","文明","和谐","自强","自由","友善","文明","诚信"];
					//获取当前文档的横坐标
					var left = event.pageX;
					//获取当前文档的纵坐标
					var top = event.pageY;
					var text = $("<div class='fa'></div>").text(arry[i]);
					
					// var arrys=["yellow","blue","red","pink","green"];
					
					var r=Math.floor(Math.random()*256);
					var g=Math.floor(Math.random()*256);
					var b=Math.floor(Math.random()*256);
					var color ="rgb("+r+","+g+","+b+")";
					
					text.css({
						"position":"absolute",
						"left":left,
						"font-size":"24px",
						"top":top,
						"color":color
					})
					$("body").append(text);
					$(".fa").animate({
						top:"-="+top+"px",
						opacity:"0.3"
					},3000,function(){
						$(this).remove();
					})
				})
			})
		</script>
	</body>
</html>
